{extend name="common:frm_base" /}
{block name="content"}
<style>
    body,html{background:none!important;}
    .hhf_ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
    .hhf_row_b{display:flex;justify-content:space-between;align-items:center;}
    .num{background:#0080cd;width:40px;height:40px;font-size:34px;color:#fff;margin-right:10px;border-radius:4px;}
    .list{flex-wrap:wrap;}
    .list .row{width:48%;color:#fff;margin-top:30px;cursor:pointer;}
    .list .row .name{background:#0f6ebd;display:flex;align-items:center;border-radius:10px 10px 0 0;}
    .list .row .name .left{margin:5px 10px;}
    .list .row .name .col{font-size:16px;margin:5px 0;}
    .list .row .number{background:#123264;padding:15px 30px;color:#38efff;font-size:30px;font-weight:bold;border-radius:0 0 10px 10px;}
    .site_list .row{color:#fff;}
    .paixing{color:#24cad1;}
    .container div {
        height: 50px;
        text-align:center;
    }
</style>
<div class="row">
    <div style="padding-bottom:15px;">
        <div>
            {volist name="site_list" id="val"}
            <div style="display:flex;height:20px;align-items:center;margin-bottom:15px;color:#fff;">
                <div class="hhf_ellipsis">{$key+1}、{$val.name}</div>
            </div>
            <div style="display:flex;height:20px;align-items:center;margin-bottom:15px;">
                <div style="width:80%;">
                    <div class="layui-progress layui-progress-big" lay-filter="demo">
                        <div style="background:#0d95ef;" class="layui-progress-bar" lay-percent="{$val['bai']}%"></div>
                    </div>
                    <!--                    <div style="background:#0d95ef;height:16px;width:{$val['bai']}%;"></div>-->
                </div>
                <div style="width:20%;text-align:right;color:#fff;">场次<span style="color:#36e1f2;">{$val.number}</span></div>
            </div>
            {/volist}
        </div>
    </div>
</div>
<script>
    layui.use('element', function () {
        window.element = layui.element;
    });
</script>
{/block}